<template>
	<view class="container">
		<u-list>
			<u-list-item v-for="item in orderList" :key="item.id">
				<view class="card">
					<view class="box">
						<u-badge max="9999" :value="item.id"></u-badge>
					</view>
					<p>商品信息：{{ item.name }} * {{ item.number }}</p>
					<p>下单时间：{{ item.orderTime }}</p>
					<p>运输商电话：{{ item.transporter }}</p>
					<image class="order-image" :src="item.image1"></image>
					<u-button v-if="item.status != 4 " type="primary" hair-line="false" @click="signForOrder(item.id)"
						style="width: 200rpx;">签收</u-button>
					<view v-else>
						<u-button disabled style="width: 200rpx;">订单已被签收</u-button>
					</view>
				</view>
			</u-list-item>
		</u-list>
	</view>
</template>


<script>
	export default {
		data() {
			return {
				token: null,
				orderList: [],
			}
		},
		created() {
			this.recordToken();
		},
		methods: {
			/**
			 * 获取JWT
			 */
			recordToken() {
				this.token = localStorage.getItem('token');
				this.getAllOrderByOwn();
			},

			/**
			 * 获取全部订单
			 */
			getAllOrderByOwn() {
				const url = "http://localhost:8088/buyer-order/getAllOrderByOwn";
				uni.request({
					url: url,
					method: 'GET',
					header: {
						'content-type': 'application/json',
						'token': this.token
					},
					success: (res) => {
						this.orderList = res.data.data;
						console.log(this.orderList);
					},
					fail: (err) => {
						console.error('获取订单数据失败：', err);
					}
				})
			},

			/**
			 * 签收订单
			 */
			signForOrder(id) {
				uni.showModal({
					title: '确认操作',
					content: '您确定签收' + id + '号订单？',
					success: (res) => {
						if (res.confirm) {
							const url = "http://localhost:8088/buyer-order/signForOrder?orderId=" + id;
							uni.request({
								url: url,
								method: 'PUT',
								header: {
									'content-type': 'application/json',
									'token': this.token
								},
								success: (res) => {
									this.loadPageData();
								},
								fail: (err) => {
									console.error('签收订单失败：', err);
								}
							})
						} else if (res.cancel) {

						}
					}
				});
			}
		},
	}
</script>


<style lang="scss">
	.page {
		height: 100vh;
		background-color: #EEEDEB;
		/* 设置页面背景颜色 */
		padding-top: 20rpx;
	}

	.container {
		padding: 10px;
	}

	.order-image {
		width: 100px;
		/* 图片宽度 */
		height: 60px;
		/* 图片高度 */
		object-fit: cover;
	}

	.box {
		width: 20px;
		height: 20px;
		border-radius: 15px;
	}

	.card {
		margin: 50rpx 0;
	}
</style>